<link rel="stylesheet" type="text/css" href="/Public/client/css/userInfo.css">
<link rel="stylesheet" type="text/css" href="/Public/client/css/ngDialog.css">
<div class="container" ng-controller="userInfoCtr">
    <div class="row">
        <div class="col-sm-2 col-md-4 main-sidebar">
            <div class="view3">
                <div class="card sidebar-user hidden-sm">
                    <div class="card-content info-wrap clearfix">                       
                        <img class="cart-photo" ng-src="{{photo}}">
                        <div class="info-items is-bfc">
                            <div class="info-name">{{username}}</div>
                            <div class="info-desc" title="">{{email}}</div>
                        </div>
                    </div>
                </div>
                <div class="card sidebar-nav">
                    <ul class="nav">
                        <li ng-class="{'person': 'is-current'}[isShow]" ng-click="showPerson()">
                            <a href="javascript:;">
                                <span class="icon icon-user nav-icon"></span>
                                <br>
                                <span class="nav-title" >个人信息</span>
                            </a>
                        </li>
                        <li ng-class="{'zm': 'is-current'}[isShow]" ng-click="showZM()">
                            <a href="javascript:;">
                                <span class="icon icon-eye nav-icon"></span>
                                <br>
                                <span class="nav-title">账号密码</span>
                            </a>
                        </li>
                        <li ng-class="{'blog': 'is-current'}[isShow]" ng-click="showBlog()">
                            <a href="javascript:;">
                                <span class="icon icon-eye nav-icon"></span>
                                <br>
                                <span class="nav-title">我发表的</span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>       
        <div class="col-sm-10 col-md-8 main-content" ng-show="isShow == 'person'">
            <div class="layer">
                <div class="view23 is-loaded">
                    <div class="card profile-manager">
                        <div class="card-header">
                            <h4 class="card-title">个人信息</h4>
                        </div>
                        <div class="card-content">
                            <div class="form-horizontal">
                                <div class="form-group"> 
                                    <label class="col-sm-2 control-label avatar-label">头像</label>
                                    <div class="col-sm-10">
                                        <div class="avatar-wrap">
                                            <div class="avatar img-100" style="background-image:url(https://striker.teambition.net/thumbnail/110fe6dbc326f610c2e45cff5c0393051d77/w/200/h/200)">
                                                <div class="progress-mask"></div>
                                            </div>
                                            <img ng-src="{{photo}}">
                                            <div class="avatar-set">                                               
                                                <form enctype="multipart/form-data" method="post" id="photoForm">
                                                     <label class="btn btn-ghost btn-primary upload-handler">上传新头像<input type="file" name="photo" class="hidden infoPhoto" onchange="angular.element(this).scope().savePhoto(this.files)" ng-model="photo"></label>
                                                <span class="error {{photoError}}">{{photoMessage}}</span>
                                                </form>  
                                            </div>
                                        </div>
                                    </div>
                                </div> 
                            </div>
                            <form class="form-horizontal" name="userInfoForm" ng-submit="saveInfo()">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">用户名</label>
                                    <div class="col-sm-10">
                                        <input class="form-control {{userNameError}}" type="text" placeholder="填写用户名" required name="userName" ng-model="username" ng-minlength="5" ng-maxlength="12">
                                        <span class="error {{userNameError}}">{{userNameMessage}}</span>
                                        <span class="error" ng-show="userInfoForm.userName.$error.minlength">用户名不得少于5个字符！</span>
                                        <span class="error" ng-show="userInfoForm.userName.$error.maxlength">用户名不得多于12个字符！</span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">性别</label>
                                    <div class="col-sm-10">                                       
                                        <label class="radio col-sm-2">
                                            <input type="radio" value="0" ng-model="gender">
                                            男
                                        </label>
                                        <label class="radio col-sm-2">
                                            <input type="radio" value="1" ng-model="gender">
                                            女
                                        </label>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">联系电话</label>
                                    <div class="col-sm-10">
                                        <input class="form-control {{phoneError}}" type="text" name="phone" ng-pattern="/^1(3|4|5|7|8)\d{9}$/" ng-model="phone" placeholder="填写联系电话">
                                        <span class="error {{phoneError}}">{{phoneMessage}}</span>
                                        <span class="error" ng-show="userInfoForm.phone.$error.pattern">请填写正确的手机号码！</span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">生日</label>
                                    <div class="col-sm-10 ">
                                        <datepicker date-format="yyyy-MM-dd" selector="form-control" date-set="{{birthday}}">
                                            <input class="form-control" ng-model="birthday" type="text" readonly/>
                                        </datepicker>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">所在地</label>
                                    <div class="col-sm-10">
                                        <input class="form-control" type="text" name="address" ng-model="address" placeholder="填写所在地">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">寄语</label>
                                    <div class="col-sm-10">
                                        <textarea class="form-control" type="text" name="wish" ng-model="wish" placeholder="填写寄语，最多150字"></textarea> 
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="col-sm-10 col-sm-offset-2">
                                        <input type="submit" class="btn btn-lg btn-primary btn-block save-handler" ng-disabled="userInfoForm.$invalid" value="保存修改">
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-sm-10 col-md-8 main-content" ng-show="isShow == 'zm'">
            <form class="form-horizontal" name="userPasswordForm" ng-submit="savePassword()">           
                <div class="layer">
                    <div class="view36 is-loaded">
                        <div class="card password-change">
                            <div class="card-header">
                                <h4 class="card-title">登录密码</h4>
                            </div>
                            <div class="card-content">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">旧密码</label>
                                    <div class="col-sm-10">
                                        <input class="name-input form-control" type="password" name="password" ng-model="password" placeholder="旧密码">
                                        <span class="error {{passwordError}}">{{passwordMessage}}</span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">新密码</label>
                                    <div class="col-sm-10">
                                        <input type="password" name="password" class="form-control {{newPasswordError}}" placeholder="新密码" ng-model="newPassword" require>
                                        <span class="error {{newPasswordError}}">{{newPasswordMessage}}</span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">确认新密码</label>
                                    <div class="col-sm-10">
                                        <input type="password" class="form-control {{newPassword1Error}}" placeholder="确认新密码" ng-model="newPassword1" require>
                                        <span class="error {{newPassword1Error}}">{{newPassword1Message}}</span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="col-sm-10 col-sm-offset-2">
                                         <input type="submit" class="btn btn-lg btn-primary btn-block save-handler" ng-disabled="userPasswordForm.$invalid" value="保存修改">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="col-sm-10 col-md-8 main-content" ng-show="isShow == 'blog'">
            <div class="list-group" infinite-scroll='getBlog()' infinite-scroll-distance='2'>
                <div class="list-group-item" ng-if="items.length" ng-repeat="item in items">
                    <h4 class="list-group-item-heading">{{item.post_title}} 
                        <a href="/#/content?post_id={{item.post_id}}" class="contrl">前往</a>
                        <a href="javascript:;" ng-click="delBlog(item.post_id)" class="contrl">删除</a>
                    </h4>
                    <p class="list-group-item-text">{{item.post_text}}</p>
                </div>
                <div ng-else class="no-data pt30">还没有发表过文章~</div>
            </div>
        </div>
    </div>  
</div>


